<template>
	<view class="flex-col page">
		<view class="flex-col group_3">
			<view class="flex-col relative group_4">
				<text class="self-start font_3">新密码</text>
				<view class="flex-col justify-start items-end">
					<input name="newpassword" v-model="newpassword" class="image-wrapper_2" type="password"
						style="border-radius:25rpx ; background-color:#e5e5e5cc ;height: 50px;width:340px ;" />
				</view>
				<text class="self-start font_3 text_6">确认密码</text>
				<input name="newpassword2" v-model="newpassword2" class="image-wrapper_2" type="password"
					style="border-radius:25rpx ; background-color:#e5e5e5cc ;height: 50px;width:340px ;" />
			</view>
			<view class="flex-col justify-start items-end">
			</view>
		</view>
		<view class="flex-col justify-start items-center button" @click="paschange()">
			<text class="font_2 text_7">提交</text>
		</view>
	</view>
</template>

<script>
	import {
		_modify
	} from '@/service/user.js'
	export default {
		data() {
			return {
				phone: '',
				newpassword: '',
				newpassword2: '',
			}
		},
		onLoad(options) {
			this.phone=options.phone
			console.log(this.phone)
		},
		methods: {
			validNewpassword(newpassword){
				if(newpassword===''){
					this.$api.msg('新密码不能为空')
					return false
				}
				return true
			},
			validNewpassword2(newpassword2){
				if(newpassword2===''){
					this.$api.msg('确认密码不能为空')
					return false
				}
				return true
			},
			//验证密码和确认密码是否一致
			validIsSameNew(pass1, pass2) {
				if (pass1 != pass2) {
					// this.$api.msg('新密码输入不一致，请重新输入');
					uni.showToast({
						title: '两次密码输入不一致，请重新输入',
						icon: 'none',
						duration: 850,
						mask: true
					})
					return false;
				}
				return true;
			},
			
			async paschange() {
			  if (this.validNewpassword(this.newpassword) && this.validNewpassword2(this.newpassword2) && this.validIsSameNew(this.newpassword, this.newpassword2)) {
			    console.log(this.phone);
			    console.log(this.newpassword);
			    let data = {
			      account_user: this.phone,
			      password_user: this.newpassword
			    };
			    let res = await _modify(data);
			    console.log(res);
			    if (res.flag == true) {
			      this.$api.msg('密码修改成功！');
			      uni.navigateTo({
			        url:'/pages/login1/login1'
			      });
			    } else {
			      this.$api.msg(res.message);
			    }
			  }
			}
		}
	}
</script>

<style scoped>
.page {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	padding: 20px;
	background-color:#ffffff;
}
.form {
	width: 100%;
	padding: 20px;
	border: 1px solid #ccc;
	border-radius: 5px;
	background-color: #fff;
}
.group_4, .input-wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	padding: 20px;
}
.input {
	border-radius: 25rpx;
	background-color: #e5e5e5cc;
	height: 45px;
	width: 340px;
	margin-bottom: 20px;
}
.button {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 90rpx;
	background-color:#138f87;
	margin-top: 68.75rpx;
	padding: 25rpx 0;
	border-radius: 56.25rpx;
}
.font_3 {
	font-size: 34rpx;
	color: #333;
	font-family: WenQuanYiMicroHeiMono;
	margin-top: 40rpx;
}
.font_2 {
	color: #ffffff; /* 修改这行使颜色变为白色 */
	text-align: center;
	font-size: 45rpx;
	font-family: WenQuanYiMicroHeiMono;
	line-height: 45.83rpx;
}
</style>